<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
</head>
<body>
	
</body>
<script>
/*
执行思路:
const treeData = [] // 创建一个数组
第一次执行函数: if (item.pid === rootValue(值是'')) { 找到一级 }

	执行里面代码体开始递归 const children = transTree(list, item.id)
	
		第二次执行函数: 进入递归第一次: 寻找1级子级 if (item.pid === item.id(父的id)) 子的pid永远等于父的id
			
			寻找到1级子级 const children = transTree(list, item.id)
				
				第三次执行函数: 进入递归第二次: 寻找2级子级 if (item.pid === item.id(父的id)) 子的pid永远等于父的id
					寻找失败,无法进入 if判断  if (item.pid === rootValue){}
					直接return treeData(空数组)
		
		第二次执行函数的结果等于空数组[]	const children = transTree(list, item.id)	children = []
			 if (children.length) {} 	无法进入,因为第三次执行函数返回了空数组,
				treeData.push(item)     把当前对象保存到数组里, 现在存的是1级子级,
					重复以上操作(第二次执行函数),继续寻找,例子里的1子级
		
		第二次执行函数全部结束后……
		
		return treeData 现在存的是当前父级下的所有递归完后的1级子级
		
		把当前 treeData 返回,作为第一次执行函数递归完的结果

此时执行 if (children.length) {item.children = children // 为当前父item添加children属性保存下属数组(动态添加字段)}

因为	 第二次执行函数 返回的 treeData 数组内有值(有子级对象)	,进入判断,

给当前 item(父级) 添加 children 字段, key = children , value = 第二次执行函数 返回的 treeData 数组内的值(数组对象)

然后执行	 treeData.push(item) 把当前父级存储到 treeData 数组里

最后执行完所有操作后返回最终整合好的 treeData,		
			
结束~
	*/ 
	function transTree(list, rootValue) { // list: 整个数组, rootValue本次要查找的目标id -> 此函数为了找到rootValue目标id的下属们
	  const treeData = [] // 装下属对象的
	  list.forEach(item => {
	    if (item.pid === rootValue) { // 当前对象pid符合, 继续递归调用查找它的下属,这里为拿到一级的
	      const children = transTree(list, item.id) // children递归的结果: 是上一次递归完成后的 treeData 数组
	      if (children.length) {
	        item.children = children // 为当前父item添加children属性保存下属数组(动态添加字段)
	      }
	      treeData.push(item) // 把当前对象保存到数组里, 继续遍历
	    }
	  })
	  return treeData // 遍历结束, rootValue的id对应下属们收集成功, 返回给上一次递归调用children, 加到父级对象的children属性下
	}
	let arr = [
			{id: "604e2251b205b95968e1312c", pid: "", name: "财务部", code: "CWBcx", manager: "管理员", introduce: "财务部"},
			{id: "604e2262b205b95968e1312d", pid: "604e2251b205b95968e1312c", name: "财务核算部", code: "CWHSB"},
			// {id: "604e227db205b95968e1312e", pid: "604e2251b205b95968e1312c", name: "税务管理部", code: "SWGLN"},
			// {id: "604e2297b205b95968e1312f", pid: "604e2251b205b95968e1312c", name: "薪资管理部", code: "XZGLB"},
			// {id: "604e222bb205b95968e1312a", pid: "", name: "行政部", code: "XZB", manager: "管理员", introduce: "行政部"},
			// {id: "604e223fb205b95968e1312b", pid: "", name: "人事部", code: "RSB", manager: "管理员", introduce: "人事部"},
	]
	transTree(arr,'')
</script>

</html>